<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="shared/css_js::header">
	<title>jQuery WeUI</title>
	<link rel="stylesheet" type="text/css" href="/static/css/weuicss/weui.min.css"/>
</head>

<body>

<header class="mui-bar mui-bar-nav">
	<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
	<h1 class="mui-title"><font size="4"><b>会员卡详情</b></font></h1>
</header>

<div class="mui-content">
	<ul class="mui-table-view">
		<li class="mui-table-view-cell mui-media" >
			<a href="#" style="background-color: cadetblue;margin: 7px;border-radius:10px;">
				<p class="mui-pull-right" style="color: white" th:text="${mouldtc.chnname}">车享家汽车美容</p>
				<h3  style="color: white;line-height: 4;margin-left: 70px" align="center" th:text="${mouldtc.tcname}">保养套餐ABC</h3>
				<p style="color: white">卡号:<span th:text="${mouldtc.cardno}">14454654541221</span></p>
				<p style="color: white">有效期:<span th:text="${mouldtc.expidate}">2017-10-22</span></p>
			</a>
		</li>
	</ul>
	<div class="weui-cells weui-cell_access" style="margin-top: 0px">
		<div class="weui-cell" style="line-height:2" >
			<div class="weui-cell__hd"><i class="fa fa-handshake-o fa-lg" style="color: black;padding-top: 5px"></i>&nbsp;&nbsp;</div>
			<div class="weui-cell__bd">
				<h4 style="margin-bottom: 0px">套餐</h4>
			</div>
		</div>
	</div>
    <ul class="mui-table-view" >
		<li class="mui-table-view-cell mui-media" style="line-height: 2">
			<a href="#" th:each="tc:${tc}">
				<div class="weui-flex">
					<div class="weui-flex__item" style="flex-grow: 8">
						<div class="mui-media-body" style="white-space: normal">
							<p style="margin-left: 10px" th:text="${tc.tcname}">普通套餐1</p>
						</div>
					</div>
					<div class="weui-flex__item" style="flex-grow: 1">
						<h4 ><span th:text="${tc.tcount}">9</span>次</h4>
					</div>
				</div>
			</a>
		</li>
	</ul>
	<div class="weui-cells__title"></div><!--间隔-->
	<div class="weui-cells weui-cell_access" style="margin-top: 0px">
		<div class="weui-cell" style="line-height:2" >
			<div class="weui-cell__hd"><i class="fa fa-handshake-o fa-lg" style="color: black;padding-top: 5px"></i>&nbsp;&nbsp;</div>
			<div class="weui-cell__bd">
				<h4 style="margin-bottom: 0px">服务项目</h4>
			</div>
		</div>
	</div>
	<ul class="mui-table-view" >
		<li class="mui-table-view-cell mui-media" style="line-height: 2">
			<a href="#" th:each="servitem:${servitem}">
				<div class="weui-flex">
					<div class="weui-flex__item" style="flex-grow: 8">
						<div class="mui-media-body" style="white-space: normal">
							<p style="margin-left: 10px" th:text="${servitem.servitemname}">更换机油</p>
						</div>
					</div>
					<div class="weui-flex__item" style="flex-grow: 1">
						<h4 ><span th:text="${servitem.tcount}">9</span>次</h4>
					</div>
				</div>
			</a>
		</li>
	</ul>
	<div class="weui-cells__title"></div><!--间隔-->
	<div class="weui-cells weui-cell_access" style="margin-top: 0px" th:onclick="'javascript:payhistory(\''+${mouldtc.cardid}+'\')'">
		<div class="weui-cell" style="line-height:2">
			<div class="weui-cell__hd"><i class="fa fa-pencil-square-o fa-lg" style="color: black;padding-top: 5px"></i>&nbsp;&nbsp;</div>
			<div class="weui-cell__bd">
				<h4>消费记录</h4>
			</div>
			<div class="weui-cell__ft"></div>
		</div>
	</div>
	<div class="weui-cells__title"></div><!--间隔-->
	<div class="weui-cells " style="margin-top: 0px">
		<div class="weui-cell" style="line-height:2" >
			<div class="weui-cell__hd"><i class="fa fa-hand-o-down fa-lg" style="color: black;padding-top: 5px"></i>&nbsp;&nbsp;</div>
			<div class="weui-cell__bd">
				<h4>备注说明</h4>
			</div>
			<div class="weui-cell__ft"></div>
		</div>
	</div>
	<ul class="mui-table-view" >
		<li class="mui-table-view-cell mui-media" style="line-height: 2">
			<a href="#" >
				<div class="mui-media-body" style="white-space: normal">
					<p th:text="${mouldtc.remark}"></p>
				</div>
			</a>
		</li>
	</ul>
	<div class="weui-cells__title" align="center">没有再多内容啦</div><!--没有再多内容啦-->
</div>

</body>
<script>
/*消费历史*/
function payhistory(cardid) {
	location.href="/custcard/payhistory?cardid="+cardid;
}
</script>
</html>
